<!--
 * @Description: 
 * @Autor: ZachGmy
 * @Date: 2021-07-14 15:18:58
 * @LastEditors: maqiang
 * @LastEditTime: 2021-09-24 09:31:41
-->
<template>
  <div>
    <!-- 1.创建一个容器 -->
    <div id="c1" style="height:200px"></div>
  </div>
</template>

<script>
// 2.引入我们要使用的组件
import { Line } from '@antv/g2plot'
export default {
  // // 3.在生命周期中创建图表 配置图标 渲染图表
  mounted() {
    const data = [
      { year: '1991', value: 3 },
      { year: '1992', value: 4 },
      { year: '1993', value: 3.5 },
      { year: '1994', value: 5 },
      { year: '1995', value: 4.9 },
      { year: '1996', value: 6 },
      { year: '1997', value: 7 },
      { year: '1998', value: 9 },
      { year: '1999', value: 13 },
    ]
    const line = new Line('c1',{
      data,
      xField: 'year',
      yField: 'value'
    })
    line.render()
  },
  created() {
    
  },
  data() {
    return {
      
    }
  },
  methods: {
    
  },
  computed:{
    
  },
  destroyed() {
    
  },
}
</script>

<style scoped>

</style>